<template>
  <div class="declare-query-table">
    <el-table
      :data="children"
      ref="form"
      :header-cell-style="{ 'background-color': '#6173C6', color: '#fff' }"
    >
      <el-table-column
        label="序号"
        align="center"
        prop="rowNumber"
        width="60"
        type="index"
      />
      <el-table-column
        label="申报标题"
        align="center"
        prop="title"
        width="300"
      />
      <el-table-column
        label="申报开始时间"
        align="center"
        prop="startTime"
        width="180"
      />
      <el-table-column
        label="申报截止时间"
        align="center"
        prop="endTime"
        width="180"
      />
      <el-table-column
        label="发布人"
        align="center"
        prop="publishUserName"
        :value="publishUserName"
      />
      <el-table-column label="发布日期" align="center" prop="publishTime" />
      <el-table-column label="状态" align="center" prop="status.desc" />
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button type="text" @click="handleFetch(scope.row)">
            详情
          </el-button>
          <el-button
            type="text"
            @click="handleUpdate(scope.row)"
            :disabled="scope.row.status.desc !== '待发布'"
          >
            修改
          </el-button>
          <el-button type="text" @click="handleDelete(scope.row)">
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  import {
    deleteDeclare,
    fetchDeclare,
    updateDeclare,
  } from '@/api/declare/index'
  export default {
    name: 'DeclareQueryTable',

    props: {
      children: Array,
    },
    methods: {
      // * 详情
      handleFetch(row) {
        this.id = row.id
        fetchDeclare(this.id).then((response) => {
          if (response.data != null) {
            this.$emit('fetch', response.data)
          } else {
            alert('网络延迟，请稍后再试')
          }
        })
      },
      // * 修改
      handleUpdate(row) {
        this.id = row.id
        fetchDeclare(this.id).then((response) => {
          if (response.data != null) {
            this.$emit('update', response.data)
          } else {
            alert('网络延迟，请稍后再试')
          }
        })
      },
      // * 删除
      handleDelete(row) {
        let id = row.id
        let title = row.title
        this.$confirm('是否确认删除标题为"' + title + '"的数据项?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        })
          .then(function() {
            return deleteDeclare({ id: id })
          })
          .then(() => {
            window.location.reload()
            this.msgSuccess('删除成功')
          })
          .catch(() => {
            this.$message('已取消删除')
          })
      },
    },
    created() {
      const _this = this
      _this.createUserName = this.$store.state.user.userInfo.userName
      _this.publishUserName = this.$store.state.user.userInfo.userName
    },
  }
</script>

<style scoped></style>
